import 'package:fish_redux/fish_redux.dart';
import 'package:flutter/material.dart';
import '../../app_files.dart';
import 'action.dart';
import 'state.dart';
import 'dart:io';

Widget buildView(
    FixOrderViewState state, Dispatch dispatch, ViewService viewService) {
  Widget _infoWidget() => Container(
        padding: EdgeInsets.only(left: 15, right: 15, bottom: 8),
        decoration: BoxDecoration(
            color: Colors.white,
            border: Border(
                bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
        child: Column(
          children: [
            Container(
              height: 44,
              child: Align(
                alignment: Alignment.centerLeft,
                child: Text(
                  '客户信息',
                  style: TextThemeConfig.Font16WithColorBold22,
                ),
              ),
              margin: EdgeInsets.only(bottom: 4),
            ),
            Container(
              padding: EdgeInsets.symmetric(vertical: 5),
              child: Row(
                children: [
                  Text(
                    '客户姓名',
                    style: TextThemeConfig.Font14WithColor66,
                  ),
                  Padding(padding: EdgeInsets.only(left: 50)),
                  Text(
                    state.model.userName,
                    style: TextThemeConfig.Font14WithColor22,
                  ),
                ],
              ),
            ),
            Container(
              padding: EdgeInsets.symmetric(vertical: 5),
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    '客户地址',
                    style: TextThemeConfig.Font14WithColor66,
                  ),
                  Padding(padding: EdgeInsets.only(left: 50)),
                  Expanded(
                    child: Text(
                      state.model.address,
                      style: TextThemeConfig.Font14WithColor22,
                    ),
                  ),
                ],
              ),
            ),
            Container(
              padding: EdgeInsets.symmetric(vertical: 5),
              child: Row(
                children: [
                  Text(
                    '联系方式',
                    style: TextThemeConfig.Font14WithColor66,
                  ),
                  Padding(padding: EdgeInsets.only(left: 50)),
                  Text(
                    state.model.phone,
                    style: TextThemeConfig.Font14WithColor22,
                  ),
                ],
              ),
            ),
            state.logList.isEmpty ? Container() : Container(
              padding: EdgeInsets.symmetric(vertical: 5),
              child: Row(
                children: [
                  Text(
                    '首次派单时间',
                    style: TextThemeConfig.Font14WithColor66,
                  ),
                  Padding(padding: EdgeInsets.only(left: 25)),
                  Text(
                    '${state.logList.first['operatetime']}',
                    style: TextThemeConfig.Font14WithColor22,
                  ),
                ],
              ),
            )
          ],
        ),
      );

  Widget _problemWidget() => Container(
        padding: EdgeInsets.only(left: 15, right: 15, bottom: 12),
        decoration: BoxDecoration(
            color: Colors.white,
            border: Border(
                bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container(
              height: 44,
              child: Align(
                alignment: Alignment.centerLeft,
                child: Text(
                  '客户问题',
                  style: TextThemeConfig.Font16WithColorBold22,
                ),
              ),
              margin: EdgeInsets.only(bottom: 4),
            ),
            Text(
              state.problemContent,
              style: TextThemeConfig.Font14WithColor99,
            ),
          ],
        ),
      );

  Widget _problemImageWidget() {
    if (state.model.images.isEmpty) return Container();
    List<String> images = state.model.images.split(',');
    if (images.length == 0) return Container();

    return Container(
      padding: EdgeInsets.only(left: 15, right: 15, bottom: 12),
      decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
              bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            height: 44,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                '问题图片',
                style: TextThemeConfig.Font16WithColorBold22,
              ),
            ),
            margin: EdgeInsets.only(bottom: 4),
          ),
          Container(
            margin: EdgeInsets.only(bottom: 12),
            height: 90,
            child: ListView.builder(
              itemBuilder: (BuildContext context, int index) {
                var file = images[index];
                return InkWell(
                    child: Container(
                        margin: EdgeInsets.only(right: 12),
                        child: CustomImage(
                          file,
                          fit: BoxFit.fill,
                          width: 90,
                          height: 90,
                        )),
                    onTap: () {

                      CommonUtils.showMediaAlbumView(
                        viewService.context,
                        initialIndex: images.indexOf(file),
                        files: images,
                      );
                    });
              },
              itemCount: images.length,
              scrollDirection: Axis.horizontal,
              itemExtent: 102,
              padding: EdgeInsets.only(),
            ),
          )
        ],
      ),
    );
  }

  Widget _bottomButton() {
    ///未接单
    if (state.step == '1') {
      return Container(
        margin: EdgeInsets.only(left: 15, right: 15, top: 30, bottom: 30),
        child: Row(
          children: [
            Expanded(
              child: Container(
                height: 45,
                decoration: BoxDecoration(
                  color: ThemeConfig.mainColor,
                  borderRadius: BorderRadius.all(Radius.circular(4)),
                ),
                child: InkWell(
                  child: Center(
                    child: Text(
                      '接单',
                      style: TextThemeConfig.Font16WithWhite,
                    ),
                  ),
                  onTap: () async {
                    CommonUtils.showWaitLoading(viewService.context);
                    ResultData res =
                        await CommonNetWork.fixGetOrder(state.model.itemID);
                    Navigator.pop(viewService.context);
                    if (res.success) {
                      CommonUtils.showToast(viewService.context, '接单成功');
                      bus.emit('refreshList');
                      dispatch(FixOrderViewActionCreator.onSetStep('2'));
                    } else {
                      CommonUtils.showErrorInfo(viewService.context, res.desc);
                    }
                  },
                ),
              ),
            ),
            Padding(padding: EdgeInsets.only(left: 24)),
            Expanded(
              child: Container(
                height: 45,
                decoration: BoxDecoration(
                  color: Colors.white,
                  border: Border.all(color: ThemeConfig.mainColor, width: 0.5),
                  borderRadius: BorderRadius.all(Radius.circular(4)),
                ),
                child: InkWell(
                  child: Center(
                    child: Text(
                      '转单',
                      style: TextThemeConfig.Font16WithMainColor,
                    ),
                  ),
                  onTap: () => CommonUtils.pushRoute(
                      viewService.context, RoutePath.orderTransferView,
                      arguments: {'itemID': state.model.itemID}),
                ),
              ),
            ),
          ],
        ),
      );
    }

    if (state.step == '2') {
      return Container(
        margin: EdgeInsets.only(left: 15, right: 15, top: 30, bottom: 30),
        height: 45,
        decoration: BoxDecoration(
          color: ThemeConfig.mainColor,
          borderRadius: BorderRadius.all(Radius.circular(4)),
        ),
        child: InkWell(
          child: Center(
            child: Text(
              '入户维修',
              style: TextThemeConfig.Font16WithWhite,
            ),
          ),
          onTap: () async {
            int res = await CommonUtils.showOKCanceltView(
                viewService.context, '确定开始入户维修？');
            if (res == 1) {
              CommonUtils.showWaitLoading(viewService.context);
              ResultData res =
                  await CommonNetWork.fixRepairOrder(state.model.itemID);
              Navigator.pop(viewService.context);
              if (res.success) {
                CommonUtils.showToast(viewService.context, '工单已为维修中状态');
                dispatch(FixOrderViewActionCreator.onSetStep('4'));
                bus.emit('refreshList');
              } else {
                CommonUtils.showErrorInfo(viewService.context, res.desc);
              }
            }
          },
        ),
      );
    }

    if (state.step == '4') {
      return Container(
        margin: EdgeInsets.only(left: 15, right: 15, top: 30, bottom: 30),
        height: 45,
        decoration: BoxDecoration(
          color: ThemeConfig.mainColor,
          borderRadius: BorderRadius.all(Radius.circular(4)),
        ),
        child: InkWell(
          child: Center(
            child: Text(
              '下一步',
              style: TextThemeConfig.Font16WithWhite,
            ),
          ),
          onTap: () => dispatch(FixOrderViewActionCreator.onSubmit()),
        ),
      );
    }
    return Container();
  }

  Widget _repairWidget() {
    return Container(
      padding: EdgeInsets.only(left: 15, right: 15, bottom: 12),
      decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
              bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            child: Padding(
              padding: EdgeInsets.only(top: 12),
              child: Text(
                '维修记录',
                style: TextThemeConfig.Font16WithColorBold22,
              ),
            ),
          ),
          Container(
            height: 70,
            child: TextField(
              minLines: 1,
              maxLines: 10,
              controller: state.contentController,
              style: TextThemeConfig.Font13WithColor22,
              decoration: InputDecoration(
                border: InputBorder.none,
                hintText: "请在此处描述问题...",
                hintStyle: TextThemeConfig.Font13WithColor99,
                contentPadding: EdgeInsets.only(),
              ),
              onChanged: (String str) {
                if (str.length > ThemeConfig.descTextLength)
                  state.contentController.text =
                      str.substring(0, ThemeConfig.descTextLength);
              },
            ),
          ),
          Container(
            margin: EdgeInsets.only(top: 20),
            height: 90,
            child: ListView.builder(
              itemBuilder: (BuildContext context, int index) {
                if (index == state.imageList.length) {
                  return InkWell(
                    child: Container(
                      margin: EdgeInsets.only(right: 12),
                      width: 90,
                      height: 90,
                      color: Color(0xffF5F5F5),
                      child: Align(
                        child: Image.asset('images/icon_camera.png'),
                      ),
                    ),
                    onTap: () =>
                        dispatch(FixOrderViewActionCreator.onTapAddPic()),
                  );
                } else {
                  var file = state.imageList[index];
                  return InkWell(
                    child: Container(
                      margin: EdgeInsets.only(right: 12),
                      width: 90,
                      height: 90,
                      child: file is File
                          ? Image(
                        image: FileImageEx(file),
                        width: 90,
                        height: 90,
                        fit: BoxFit.fill,
                      )
                          : CustomImage(
                        file,
                        fit: BoxFit.fill,
                        width: 90,
                        height: 90,
                      ),
                    ),
                    onTap: () =>
                        dispatch(FixOrderViewActionCreator.onTapPic(file)),
                  );
                }
              },
              itemCount: state.imageList.length + 1,
              scrollDirection: Axis.horizontal,
              itemExtent: 102,
              padding: EdgeInsets.only(),
            ),
          ),
        ],
      ),
    );
  }

  return Scaffold(
    appBar: myAppBar(viewService.context, title: '维修工单',actions:state.model.userAccount.isEmpty ? null : [ GestureDetector(
      behavior: HitTestBehavior.translucent,
      child: Container(
        padding: EdgeInsets.only(right: 12),
        height: 40,
        child: Center(
          child: Text(
            '维修记录',
            style: TextThemeConfig.ActionBarTitle,
          ),
        ),
      ),
      onTap: () => CommonUtils.pushRoute(
          viewService.context, RoutePath.fixHistoryView,
          arguments: {
            'userNo': state.model.userAccount,
          }),
    )]),
    body: SafeArea(
      child: GestureDetector(
        child: SingleChildScrollView(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _infoWidget(),
              _problemWidget(),
              _problemImageWidget(),
              state.step == '4' ? _repairWidget() : Container(),
              _bottomButton(),
            ],
          ),
          controller: state.scrollController,
        ),
        onTap: () => CommonUtils.closeKey(viewService.context),
        behavior: HitTestBehavior.translucent,
      ),
    ),
  );
}
